<template>
	<el-row>
	  <el-col :span="24" :offset="1">
	
	<el-table :data="tableData" style="width: 80%" max-height="500" >
		<el-table-column fixed  label="图片" width="100">
			<template slot-scope="scope">
			          <el-image style="width: 50px; height: 50px" :src="scope.row.image" :preview-src-list="[scope.row.image]">
			            <div slot="error" class="image-slot">
			              <i class="el-icon-picture-outline"></i>
			            </div>
			          </el-image>
			 </template>
		</el-table-column>
		<el-table-column prop="productName" label="商品名" width="120">
		</el-table-column>
		<el-table-column prop="introduce" label="商品介绍" width="120">
		</el-table-column>
		<el-table-column prop="basePrice" label="起拍底价" width="100">
		</el-table-column>
		<el-table-column prop="price" label="成交价" width="100">
		</el-table-column>
		<el-table-column prop="address" label="收货地址" width="120">
		</el-table-column>
		<el-table-column prop="starttime" label="拍卖开始时间" width="120">
		</el-table-column>
		<el-table-column prop="deadline" label="拍卖结束时间" width="120">
		</el-table-column>
		<el-table-column prop="bond" label="保证金" width="120">
		</el-table-column>
		<el-table-column fixed="right" label="操作" width="120">
			<template slot-scope="scope" >
				<el-button v-if="scope.row.orderStatus==1" @click="pay(scope.row)" type="text" size="small">
					立即支付尾款
				</el-button>
			</template>
		</el-table-column>
	</el-table>
	</el-col>
	</el-row>
</template>

<script>
	export default {
		methods: {
			pay(row) {
				console.log(sessionStorage.getItem("uid"))
				row.uid=sessionStorage.getItem("uid")
				console.log(row)
				this.$ax.post("/epai/order/pay",row).then((resp) => {
					
				// 添加之前先删除一下，如果单页面，页面不刷新，添加进去的内容会一直保留在页面中，二次调用form表单会出错
				const divForm = document.getElementsByTagName("div");
				if (divForm.length) {
					document.body.removeChild(divForm[0]);
				}
				const div = document.createElement("div");
				div.innerHTML = resp.data; // data就是接口返回的form 表单字符串
				document.body.appendChild(div);
				document.forms[0].setAttribute("target", "_blank"); // 新开窗口跳转
				document.forms[0].submit();
				});

			},
			getUnpaid(){
				this.$ax.get("/epai/order/getOrders/"+sessionStorage.getItem("uid")).then(resp=>{
					console.log(resp)
					this.tableData=resp.data.data
					console.log(this.tableData)
				})
			}
		},
		data() {
			return {
				tableData: [],
				uid:sessionStorage.getItem("uid")
			}
		},
		mounted() {
			this.getUnpaid()
		}
	}
</script>
